<template>
    <div>
        <h1>test4界面在全局对象中取到的值</h1>
        <p>{{$store.state.userInfo}}</p>
        <p>点击test4界面按钮把全局对象中的userInfo修改</p>
        <button @click="upVuexdata()">修改</button>
        <p>修改完后的数据-->这里是对全局对象中的userInfo修改，所以其他组件中引用的userInfo也会修改</p>
        <p>{{$store.state.userInfo}}</p>
    </div>
</template>

<script>
    import {USER_INFO} from '../../store/modules/mutation-types.js';
    export default {
        name: "test4",
        methods: {
            upVuexdata() {
                let upUserInfo = {
                    id: "0003",
                    name: 'X',
                    age: '23'
                }
                this.$store.commit(USER_INFO, upUserInfo);
                console.log("js中取全局对象")
                console.log(this.$store.state.userInfo.age)

            }
        }
    }
</script>

<style scoped>

</style>
